<template>
  <div class="app-container">
    <el-card shadow="always" :body-style="{ padding: '20px' }">
      <div slot="header">
        <span>员工的批量导入</span>
      </div>
      <!-- card body -->
      <!-- 导入组件 -->
      <UploadExcel :before-upload="beforeUpload" :on-success="onSuccess" />
    </el-card>
  </div>
</template>

<script>
// 导入
import { importEmployees } from '@/api/employees.js'

// 导入 Excel 转换时间
import { formatExcelDate } from '@/utils/index.js'

export default {
  name: 'Import',
  methods: {
    beforeUpload (file) {
      console.log(file)
      // 作用:校验格式和大小
      // 校验通过返回 true 才会继续执行
      return true
    },
    // Excel 数据导入
    async onSuccess (res) {
      // 校验通过 , 获取数据
      console.log('读取数据:', res)
      // 中文转英文
      const newArr = this.transExcelData(res.results)
      // 调用API接口 数据导入 数据库
      await importEmployees(newArr)
      // 提示
      this.$message.success('添加成功')
      // 返回上一级页面
      this.$router.back()
    },
    // key 中文转英文 , 为导入做准备
    transExcelData (results) {
      // 中英对照表 , 映射关系
      const userRelations = {
        '入职日期': 'timeOfEntry',
        '聘用形式': 'formOfEmployment',
        '手机号': 'mobile',
        '姓名': 'username',
        '转正日期': 'correctionTime',
        '工号': 'workNumber',
        '部门': 'departmentName'
      }
      // 准备一个空数组 , 用于保存转换的结果
      const newArr = []
      results.forEach(item => {
        // 替换为key是英文的新对象，添加进数组
        // 储存转换的员工信息对象
        const _item = {}
        // 转换中文key
        for (const key in item) {
          // 获取英文 key
          const enKey = userRelations[key]
          // 解决Excel 的时间错误 , 做转换
          if (enKey === 'timeOfEntry' || enKey === 'correctionTime') {
            // 格式化excel时间
            _item[enKey] = formatExcelDate(item[key], '-')
          } else {
            _item[enKey] = item[key]
          }
        }
        newArr.push(_item)
      })
      console.log(newArr)
      return newArr
    }

  }
}
</script>

<style lang="scss" scoped>
</style>
